<script setup>

</script>

<template>
  <view class="container">
    <!-- 队长信息卡片 -->
    <view class="leader-card">
      <text class="school-name">武汉第一中学</text>
      <view class="leader-info">
        <image class="avatar" src="/static/image/3.1.11.jpg"></image>
        <view class="info-text">
          <text class="leader-name">陈婉仪</text>
          <text class="leader-id">202011090890</text>
          <text class="college">计算机学院</text>
        </view>
        <button class="call-button" @click="makePhoneCall">

          <text>拨打电话</text>
        </button>
      </view>
    </view>
    <!-- 暂无队员提示 -->
    <view class="no-member-tip">
      <text class="tip-text">当前暂无队员</text>
      <text class="tip-sub-text">可联系意向队员在活动广场中申请</text>
    </view>
  </view>
</template>



<style scoped>
.container {
  padding: 15px;
  background-color: #fff;
}

.leader-card {
  background-color: #f5f5f5;
  border-radius: 8px;
  padding: 15px;
  margin-bottom: 20px;
}

.school-name {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 10px;
  display: block;
}

.leader-info {
  display: flex;
  align-items: center;
}

.avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  margin-right: 12px;
}

.info-text {
  flex: 1;
}

.leader-name {
  font-size: 14px;
  font-weight: bold;
  display: block;
  margin-bottom: 4px;
}

.leader-id,
.college {
  font-size: 12px;
  color: #666;
  display: block;
  margin-bottom: 2px;
}

.call-button {
  display: flex;
  align-items: center;
  background-color: #07c160;
  color: #fff;
  border: none;
  border-radius: 4px;
  padding: 6px 12px;
}


.no-member-tip {
  text-align: center;

}

.tip-text {
  font-size: 14px;
  color: #999;
  display: block;
  margin-bottom: 8px;
}

.tip-sub-text {
  font-size: 12px;
  color: #ccc;
  margin-bottom:100px ;
}
</style>e>